<!doctype html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>KindEditor</title>
		<style>
			textarea {
				display: block;
			}
			.ke-icon-example1 {
				background-image: url(../skins/default/default.gif);
				background-position: 0px -672px;
				width: 16px;
				height: 16px;
			}
			.ke-icon-example2 {
				background-image: url(../skins/default/default.gif);
				background-position: 0px -672px;
				width: 16px;
				height: 16px;
			}
		</style>
		<script charset="utf-8" src="../kindeditor.js"></script>
		<script>
			KE.lang.example1 = '插入HTML';
			KE.plugin.example1 = {
				click : function(id) {
					KE.insertHtml(id, '<strong>测试内容</strong>');
				}
			};
			KE.lang.example2 = 'CLASS样式';
			KE.plugin.example2 = {
				click : function(id) {
					var self = this;
					var cmd = 'example2';
					KE.util.selection(id);
					var menu = new KE.menu({
						id : id,
						cmd : cmd,
						width : 120
					});
					menu.add('红底白字', function() { self.exec(id, 'red'); });
					menu.add('绿底白字', function() { self.exec(id, 'green'); });
					menu.add('黄底白字', function() { self.exec(id, 'yellow'); });
					menu.show();
					this.menu = menu;
				},
				exec : function(id, value) {
					var cmd = new KE.cmd(id);
					cmd.wrap('span', [{'class': value}]);
					KE.util.execOnchangeHandler(id);
					this.menu.hide();
					KE.util.focus(id);
				}
			};
			KE.show({
				id : 'content1',
				cssPath : 'index.css',
				items : ['source', 'removeformat', 'example1', 'example2']
			});
		</script>
	</head>
	<body>
		<h3>自定义插件 - 插入HTML、CLASS样式</h3>
		<textarea id="content1" name="content" style="width:700px;height:300px;visibility:hidden;"></textarea>
	</body>
</html>
